<template>
	<view class="content">
		<view class="search"><uni-search-bar style="height: 100rpx;" @confirm="search" :radius="100"></uni-search-bar></view>
		<view class="title" v-for="(item, index) in data" :key="index" @click="detail(item)">{{ ++index }}、{{ item.title }}</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			page: 1,
			data: [],
			params: {},
			isdata: true
		};
	},
	onReachBottom() {
		if (this.isdata) {
			++this.page;
			this.$myRequest({
				url: '/question',
				method: 'get',
				data: { ...this.params, page: this.page }
			}).then(res => {
				if (res.data.length < 20) {
					this.isdata = false;
					uni.showToast({
						title: '加载完毕'
					});
				} else {
					this.isdata = true;
				}
				this.data = [...this.data, ...res.data];
			});
		}
	},
	methods: {
		search(e) {
			this.data = [];
			this.params = { title: e.value, page: this.page };
			this.$myRequest({
				url: '/question',
				method: 'get',
				data: this.params
			}).then(res => {
				if (res.data.length < 20) {
					this.isdata = false;
					uni.showToast({
						title: '加载完毕'
					});
				} else {
					this.isdata = true;
				}
				this.data = [...this.data, ...res.data];
			});
		},
		detail(e) {
			uni.setStorage({
				key: 'item',
				data: e
			});
			uni.navigateTo({
				url: '../detail/detail'
			});
		}
	}
};
</script>

<style lang="less">
.title {
	padding: 40rpx 20rpx;
	border-bottom: 1rpx solid #ccc;
}
.search {
	width: 90%;
	margin: 0 auto;
}
</style>
